import { Component } from 'react';
import { NavBar, Toast, Button, Radio,RadioGroup} from 'react-vant';
import WithRouter from '../../router/withRouter';
import './index.less'
import { getAddressList,setDefaultAddress } from '../../api/address';
import { Edit, Delete } from '@react-vant/icons'
class Address extends Component {
    state = {
        list: [],
        isRadio:null
    }
    render() {
        let {isRadio} = this.state
        return (
            <div className='address'>
                <NavBar
                    title="收货地址"
                    onClickLeft={() => this.props.router.navigate(-1)}
                    fixed
                />
                <div>
                    <RadioGroup value={isRadio} onChange={async (value)=>{
                        console.log(value)
                        let res = await setDefaultAddress({id:value.id});
                        if(res.data.code ===200){
                            Toast.success("设置成功")
                            this.setState({
                                isRadio:value
                            })
                        
                        }else{
                            Toast.fail(res.data.message)
                        }
                    }}>
                    {
                        this.state.list.map((item, index) => {
                            return (
                                <div className='list' key={index}>
                                    <div className='username'>
                                        收货人：{item.realName} {item.phone}
                                    </div>
                                    <div className='addressinfo'>
                                        收货地址：{item.province}{item.city}{item.district}{item.detail}
                                    </div>
                                    <div className='actions'>
                                        <div>
                                            <Radio name={item}>设为默认</Radio>
                                        </div>
                                        <div className='edit'>
                                            <span><Edit color='#444'></Edit> 编辑</span>
                                            <span><Delete color='#444'></Delete>删除</span>
                                        </div>
                                    </div>
                                </div>
                            )
                        })
                    }
                </RadioGroup>
                </div>
                <div className='btn'>
                    <Button type='danger' block round onClick={()=>{
                        this.props.router.navigate("/add")
                    }}>添加收货地址</Button>
                </div>
            </div>
        )
    }
    async componentDidMount() {
        let res = await getAddressList();
        console.log(res)
         let index =  res.data.data.list.findIndex((item)=>{
            return item.isDefault
        })
        this.setState({
            list: res.data.data.list,
            isRadio:res.data.data.list[index]
        })
    }
}
export default WithRouter(Address)